<template>
	<view>
		<zero-loading type="circle" v-if="loading"></zero-loading>
		<view class="title "></view>
		<scroll-view scroll-y="true" class="scroll-Y" :style='{ height: scrollHeight }'>
			<view class="flex text-center nav">
				<view :class="TabCur==0?'text-olive cur':'text-gray'" class="cu-item  flex-sub  " @tap="onTabSelect(0)">
					<i class="iconfont icon-pie  padding-right-xs"></i>
					<text class=" text-md ">
						猪场概览
					</text>
				</view>
				<view :class="TabCur==1?'text-olive cur':'text-gray'" class="cu-item flex-sub  " @tap="onTabSelect(1)">
					<i class="iconfont icon-house  padding-right-xs"></i>
					<text class=" text-md ">
						单元列表
					</text>
				</view>
				<view :class="TabCur==2?'text-olive cur':'text-gray'" class="cu-item flex-sub  " @tap="onTabSelect(2)">
					<i class="iconfont icon-yingjian  padding-right-xs"></i>
					<text class=" text-md ">
						智能终端
					</text>
				</view>

			</view>

			<block v-if="TabCur==0">
				<scroll-view scroll-y="true" class="scroll-Y " :style='{ height: innerScrollHeight }'>
					<view class="cu-bar solid-bottom">
						<view class="action">
							<text class="cuIcon-titles text-olive"></text><text class="text-grey ">概览</text>
						</view>
						<!-- <view class="action">
							<text class="cuIcon-moreandroid text-icon-size text-olive "></text>
						</view> -->
					</view>

					<view class="grid col-2 padding-xs">
						<view class="padding-xs">
							<view class="bg-pannel padding-sm radius  shadow" hover-class="opcity"
								hover-stay-time="150">
								<view class="flex ">
									<view class="flex-sub flex align-center ">
										<i class="iconfont icon-food text-sl text-grey"></i>
									</view>
									<view class="flex-twice">
										<view class="text-sm text-grey">
											今日头均采食
											
										</view>
										<view class="margin-top-sm text-xl ">{{today_avg_feed}}
											<text class="text-grey margin-left-xs text-xs"> kg</text>
											<text v-if="today_feed_diff<=0"
												class=" text-green margin-left-xs text-xs"> ⬇{{Math.abs(today_feed_diff)}}%</text>
											<text v-if="today_feed_diff>0"
												class="text-orange margin-left-xs text-xs"> ⬆{{Math.abs(today_feed_diff)}}%</text>
										</view>
									</view>
								</view>

							</view>
						</view>

						<view class="padding-xs">
							<view class="bg-pannel padding radius  shadow" hover-class="opcity" hover-stay-time="150">
								<view class="flex ">
									<view class="flex-sub flex align-center ">
										<i class="iconfont icon-water text-sl text-gray"></i>
									</view>

									<view class="flex-twice">
										<view class="text-sm text-grey">
											今日头均饮水
											
										</view>
										<view class="margin-top-sm text-xl ">{{today_avg_water}}
											<text class="text-grey margin-left-xs text-xs"> L</text>
											<text v-if="today_water_diff<=0"
												class="text-green margin-left-xs text-xs"> ⬇{{Math.abs(today_water_diff)}}%</text>
											<text v-if="today_water_diff>0"
												class="text-orange margin-left-xs text-xs"> ⬆{{Math.abs(today_water_diff)}}%</text>
										</view>
									</view>
								</view>

							</view>
						</view>

						<view class="padding-xs">
							<view class="bg-pannel padding radius  shadow" hover-class="opcity" hover-stay-time="150">
								<view class="flex ">
									<view class="flex-sub flex align-center ">
										<i class="iconfont icon-food text-sl text-grey"></i>
									</view>
									<view class="flex-twice">
										<view class="text-sm text-grey">昨日头均采食</view>
										<view class="margin-top-sm text-xl ">{{yestoday_avg_feed}} <text
												class="text-grey margin-left-xs text-xs"> kg</text></view>
									</view>
								</view>

							</view>
						</view>

						<view class="padding-xs">
							<view class="bg-pannel padding radius  shadow" hover-class="opcity" hover-stay-time="150">
								<view class="flex ">
									<view class="flex-sub flex align-center ">
										<i class="iconfont icon-water text-sl text-grey"></i>
									</view>
									<view class="flex-twice">
										<view class="text-sm text-grey">昨日头均饮水</view>
										<view class="margin-top-sm text-xl ">{{yestoday_avg_water}} <text
												class="text-grey margin-left-xs text-xs">L</text></view>
									</view>
								</view>

							</view>
						</view>

						<view class="padding-xs">
							<view class="bg-pannel padding radius  shadow" hover-class="opcity" hover-stay-time="150">
								<view class="flex ">
									<view class="flex-sub flex align-center ">
										<i class="iconfont icon-pig2 text-sl text-grey"></i>
									</view>
									<view class="flex-twice">
										<view class="text-sm text-grey">猪只数</view>
										<view class="margin-top-sm text-xl ">{{pig_num_total}} <text
												class="text-grey margin-left-xs text-xs">头</text></view>
									</view>
								</view>

							</view>
						</view>

						<view class="padding-xs">
							<view class="bg-pannel padding radius  shadow" hover-class="opcity" hover-stay-time="150">
								<view class="flex ">
									<view class="flex-sub flex align-center ">
										<i class="iconfont icon-pig2 text-sl text-grey"></i>
									</view>
									<view class="flex-twice">
										<view class="text-sm text-grey">仔猪数</view>
										<view class="margin-top-sm text-xl ">{{son_total}} <text
												class="text-grey margin-left-xs text-xs">头</text></view>
									</view>
								</view>

							</view>
						</view>

						<view class="padding-xs">
							<view class="bg-pannel padding radius  shadow" hover-class="opcity" hover-stay-time="150">
								<view class="flex ">
									<view class="flex-sub flex align-center ">
										<i class="cuIcon-wifi text-xxxl text-grey"></i>
									</view>
									<view class="flex-twice">
										<view class="text-sm text-grey">在线/总设备</view>
										<view :class="online_num>0 && offline_num==0?'text-green':'text-orange'"
											class="margin-top-sm text-xl ">
											{{online_num}}/{{online_num+offline_num}}<text
												class="text-grey margin-left-xs text-xs"></text>
										</view>
									</view>
								</view>

							</view>
						</view>

						<view class="padding-xs">
							<view :class="alarm_num>0?'bg-alarm':''" class="bg-pannel padding radius  shadow"
								hover-class="opcity" hover-stay-time="150" @tap="onFarmAlarm()">
								<view class="flex ">
									<view class="flex-sub flex align-center ">
										<i class="cuIcon-notice text-xxxl "
											:class="{'text-grey': isNaN(alarm_num)||alarm_num==0,'text-red':alarm_num>0}"></i>
									</view>
									<view class="flex-twice">
										<view class="text-sm text-grey">告警</view>
										<view
											:class="{'text-grey': isNaN(alarm_num)||alarm_num==0,'text-red':alarm_num>0}"
											class="margin-top-sm text-xl ">{{alarm_num}} <text
												class="text-grey margin-left-xs text-xs"></text></view>
									</view>
								</view>

							</view>
						</view>

					</view>

					<view class=""></view>
					<view class="">
						<text class="padding-left text-sm text-grey">饲喂器在线率:</text>
					</view>

					<view class="padding-sm">
						<view class="flex padding-left-xs padding-right-xs">
							<view class=" cu-progress   ">
								<view v-if="online_per>40" :class="online_per>95?'bg-green':'bg-orange'"
									:style="[{ width: online_per+'%' }]">{{online_per}}%</view>
								<view v-if="online_per<=40" :class="online_per>10?'bg-orange':'bg-red'"
									:style="[{ width: online_per+'%' }]">{{online_per}}%</view>
							</view>
						</view>
					</view>


					<view class="cu-bar solid-bottom">
						<view class="action">
							<text class="cuIcon-titles text-olive"></text><text class="text-grey ">日采食量总量</text>
						</view>
						<view class="action">
							<view class="">
								<button @tap="onTabDaySumFeedType('')" :class="DaySumFeedType==''?'':'line-grey'"
									class="cu-btn bg-olive shadow sm margin-right-xxs">全部</button>
								<button @tap="onTabDaySumFeedType('auto')"
									:class="DaySumFeedType=='auto'?'':'line-grey'"
									class="cu-btn bg-olive  shadow sm margin-right-xxs">智能</button>
								<button @tap="onTabDaySumFeedType('man')" :class="DaySumFeedType=='man'?'':'line-grey'"
									class="cu-btn bg-olive  shadow sm">手动</button>
							</view>
						</view>
					</view>
					<view style="height: 500rpx">
						<l-echart ref="chart"></l-echart>
					</view>


					<view class="cu-bar solid-bottom">
						<view class="action">
							<text class="cuIcon-titles text-olive"></text><text class="text-gray ">头均采食量</text>
						</view>
					</view>
					<view style="height: 500rpx">
						<l-echart ref="chart1"></l-echart>
					</view>

				</scroll-view>
			</block>

			<block v-if="TabCur==1">
				<view class="cu-bar solid-bottom justify-center">

					<view class="solid-bottom">
						<button @tap="onTabHouseType('')" :class="house_type==''?'':'line-grey'"
							class="cu-btn bg-olive shadow sm margin-right-xxs">全部</button>
						<button @tap="onTabHouseType('1')" :class="house_type=='1'?'':'line-grey'"
							class="cu-btn bg-olive shadow sm margin-right-xxs">妊娠舍</button>
						<button @tap="onTabHouseType('2')" :class="house_type=='2'?'':'line-grey'"
							class="cu-btn bg-olive  shadow sm margin-right-xxs">哺乳舍</button>
						<button @tap="onTabHouseType('3')" :class="house_type=='3'?'':'line-grey'"
							class="cu-btn bg-olive  shadow sm margin-right-xxs">保育舍</button>
						<button @tap="onTabHouseType('4')" :class="house_type=='4'?'':'line-grey'"
							class="cu-btn bg-olive  shadow sm margin-right-xxs">育肥舍</button>
						<button @tap="onTabHouseType('5')" :class="house_type=='5'?'':'line-grey'"
							class="cu-btn bg-olive  shadow sm margin-right-xxs">公猪舍</button>
					</view>
				</view>
				<scroll-view scroll-y="true" class="scroll-Y " :style='{ height: houseListScrollHeight }'>
					<!-- <arprogress :percent="90"><text>90%</text></arprogress> -->
					<!-- <l-circle :current.sync="0" :percent="50">
					    <text>0%</text>
					</l-circle> -->
					<!-- <cmd-progress type="circle" :percent="75"></cmd-progress>
					<cmd-progress type="circle" :percent="75" :showInfo="true"></cmd-progress>
					<cmd-progress type="circle" :percent="30" status="exception"></cmd-progress>
					<cmd-progress type="circle" :percent="60" status="success"></cmd-progress>
					<cmd-progress type="circle" :percent="0"></cmd-progress>
					<cmd-progress type="circle" :percent="76" :stroke-width="24"></cmd-progress>
					<cmd-progress type="circle" :percent="45" :gapDegree="66" stroke-color="#ef32d9"></cmd-progress>
					<cmd-progress type="circle" :percent="88" gap-position="left" stroke-shape="square"></cmd-progress>
					<cmd-progress type="circle" :percent="76" :width="40" stroke-shape="square"></cmd-progress> -->
					<!-- <cmd-progress type="circle" :percent="动态值" :stroke-width="12"></cmd-progress> -->

					<view class="house_panel margin-sm" hover-class="opcity" hover-stay-time="150"
						v-for="(item, idx) in houseList" :key="idx" @tap="onHouseClick(item)">
						<view class="padding-sm flex align-center">
							<view class="flex-treble text-left">
								<text class="iconfont icon-house  text-grey "></text>
								<text
									class=" text-icon-size text-grey text-md padding-left-xs">{{item.housename}}</text>

							</view>
							<view class="flex-sub text-right">
								<view v-if="item.alarm_num>0" class="cu-tag round bg-red sm"
									@tap.stop="onHouseAlarm(item)">{{item.alarm_num}}
								</view>
								<!-- <view  class="cu-tag round bg-white sm">单元温度 - ℃
								</view> -->
							</view>
						</view>

						<view class="padding-xs">
							<view class="flex padding">
								<view class=" cu-progress   ">
									<view v-if="item.feed_per>40" :class="item.feed_per>95?'bg-green':'bg-orange'"
										:style="[{ width: item.feed_per+'%' }]">{{item.feed_per}}%</view>
									<view v-if="item.feed_per<=40" :class="item.feed_per>10?'bg-orange':'bg-red'"
										:style="[{ width: item.feed_per+'%' }]">{{item.feed_per}}%</view>
								</view>
							</view>
						</view>

						<view class="grid col-3 ">
							<view class="padding-sm text-center shadow border">
								<view class="text-xxl line-grey bottom-grey-line padding-bottom-xs text-black">{{item.today_avg_feed}}
									<text class="text-gray margin-left-xs text-xxs"> kg</text>
								</view>
								<view class="margin-top-xs text-Abc line-grey text-xs">今日头均采食量</view>
							</view>
							<view  class="padding-sm text-center shadow border">
								<view class="text-xxl line-grey bottom-grey-line padding-bottom-xs text-black">
									{{item.today_avg_water}}
									<text class="text-gray margin-left-xs text-xxs"> L</text>
								</view>
								<view class="margin-top-xs text-Abc text-grey text-xs">今日头均饮水量</view>
							</view>
							
							<view class="padding-sm text-center shadow border">
								<view class="text-xxl line-grey bottom-grey-line padding-bottom-xs text-black">
									{{item.yestoday_avg_feed}}
									<text class="text-gray margin-left-xs text-xxs"> kg</text>
								</view>
								<view class="margin-top-xs text-Abc text-grey text-xs">昨日头均采食量</view>
							</view>
						</view>
						<view class="grid col-3 ">

							<view class="padding-sm text-center shadow border">
								<view v-if="item.house_type==2"
									class="text-xxl line-grey bottom-grey-line padding-bottom-xs text-black">
									{{item.pig_num_total}}
									<text class="text-gray margin-left-xs text-xxs"> 头</text>
								</view>
								<view v-if="item.house_type!=2"
									class="text-xxl line-gray bottom-grey-line padding-bottom-xs text-black">
									{{item.pig_num_total}}
									<text class="text-gray margin-left-xs text-xxs"> 头</text>
								</view>
								<view class="margin-top-xs text-Abc text-grey text-xs">猪只数</view>
							</view>

							<view v-if="item.house_type==2" class="padding-sm text-center shadow border">
								<view class="text-xxl line-grey bottom-grey-line padding-bottom-xs text-black">
									{{item.son_total}}
									<text class="text-grey margin-left-xs text-xxs"> 头</text>
								</view>
								<view class="margin-top-xs text-Abc text-grey text-xs">仔猪</view>
							</view>

							<view class="padding-sm text-center shadow border">
								<view
									:class="item.online_num>0 && item.online_num==item.device_num?'text-olive':'text-orange'"
									class="text-xxl bottom-grey-line padding-bottom-xs">
									{{item.online_num}}/{{item.device_num}}
								</view>
								<view class="margin-top-xs text-Abc text-grey text-xs">在线/总设备</view>
							</view>
							<view class="padding-sm text-center shadow border">
								<view class="text-xxl line-grey bottom-grey-line padding-bottom-xs text-black">
									-
									<text class="text-grey margin-left-xs text-xxs"> ℃</text>
								</view>
								<view class="margin-top-xs text-Abc text-grey text-xs">单元温度</view>
							</view>
							<view class="padding-sm text-center shadow border">
								<view class="text-xxl line-grey bottom-grey-line padding-bottom-xs text-black">
									-
									<text class="text-grey margin-left-xs text-xxs"> </text>
								</view>
								<view class="margin-top-xs text-Abc text-grey text-xs">单元日龄</view>
							</view>
						</view>


					</view>
				</scroll-view>
			</block>

			<block v-if="TabCur==2">
				<scroll-view scroll-y="true" class="scroll-Y padding-sm" :style='{ height: offsetDeviceListScrollHeight }'>
					<block v-for="(item, idx) in deviceList" :key="idx">

						<view :class="item.alive>0?'bg-online':'bg-offline'" class="device-pannel margin-sm "
							hover-class="opcity" hover-stay-time="150" @tap="onDeviceTap(item)">
							<view class="padding-sm flex align-center">
								<view class="flex-treble text-left">
									<text :class="item.alive>0?'text-grey':'text-grey'"
										class="iconfont icon-yingjian   "></text>
									<text :class="item.alive>0?'text-grey':'text-grey'"
										class=" text-icon-size  text-md padding-left-xs">{{item.housename}} </text>

								</view>
								<view class="flex-sub text-right justify-center">
									<view v-if="item.alive>0" class="">
										<text class="iconfont icon-zaixian2 text-olive"></text>
									</view>
									<view v-if="item.alive==0" class="">
										<text class="iconfont icon-lixian1 text-gray"></text>
									</view>
								</view>
							</view>
							<view class="padding-left padding-right flex align-center text-gray">
								<view class="flex-sub">
									<view class="fl text-xs  text-left">终端编码:</view>
								</view>
								<view class="flex-twice">
									<view class="fr text-xs ">
										{{item.device_addr}}
									</view>
								</view>
							</view>
							<view class="padding-left padding-right flex align-center text-gray">
								<view class="flex-sub">
									<view class="fl text-xs  text-left">饲喂器在线:</view>
								</view>
								<view class="flex-twice">
									<view class="fr text-xs " :class=" (item.node_num==0 || item.online_node_num<item.node_num)?'text-orange':'text-olive' ">
										{{item.online_node_num}}
									</view>
								</view>
							</view>
							<view class="padding-left padding-right flex align-center text-gray">
								<view class="flex-sub">
									<view class="fl text-xs  text-left">版本号:</view>
								</view>
								<view class="flex-twice">
									<view class="fr text-xs text">
										{{item.version}}
									</view>
								</view>
							</view>
							<view class="padding-left padding-right flex align-center text-gray">
								<view class="flex-sub">
									<view class="fl text-xs  text-left">饲喂器版本号:</view>
								</view>
								<view class="flex-twice">
									<view class="fr text-xs ">
										{{item.node_version}}
									</view>
								</view>
							</view>
							<view class="padding-left padding-right padding-bottom flex align-center text-gray">
								<view class="flex-sub">
									<view class="fl text-xs  text-left">最后心跳:</view>
								</view>
								<view class="flex-twice">
									<view class="fr text-xs ">
										{{item.lasttime}}
									</view>
								</view>
							</view>

							<view v-if="item.update" class="padding-left padding-right padding-bottom flex align-center text-orange">
								<view class="flex-sub">
									<view class="fl text-xs  text-left">升级饲喂器中:</view>
								</view>
								<view class="flex-twice">
									<view class="fr text-xs ">
										{{item.upStatus}}
									</view>
								</view>
							</view>

						</view>
					</block>

				</scroll-view>

				<view class="">
					<!-- <view v-if="is_admin" class="grid col-2 ">
						<view class="split padding-left-lg">
							<view @tap="showModal()" class="tab-batch padding-sm shadow" hover-class="opcity"
								hover-stay-time="150">
								<view class="flex  align-center ">
									<view class="flex-sub text-center">
										<i class="cuIcon-apps  text-white"></i>
										<text class="padding-left-xs text-lg text-white">批量</text>
									</view>
								</view>
							</view>
						</view>

						<view class="padding-right-lg">
							<view @tap="loadRooms(true)" class="tab-reload padding-sm shadow" hover-class="opcity"
								hover-stay-time="150">
								<view class="flex  align-center ">
									<view class="flex-sub text-center">
										<i class="cuIcon-refresh  text-white"></i>
										<text class="padding-left-xs text-lg text-white">刷新</text>
									</view>
								</view>
							</view>
						</view>
					</view> -->


					<!-- <view v-if="is_admin">
						<view  class="grid col-2 ">
							<view class="split padding-left-lg">
								<view @tap="updateGw()" class="tab-batch padding-sm shadow" hover-class="opcity"
									hover-stay-time="150">
									<view class="flex  align-center ">
										<view class="flex-sub text-center">
											<i class="iconfont icon-yingjian text-white"></i>
											<text class="padding-left-xs text-md text-white">批量升级终端</text>
										</view>
									</view>
								</view>
							</view>
	
							<view class="padding-right-lg">
								<view @tap="updateNode()" class="tab-reload padding-sm shadow" hover-class="opcity"
									hover-stay-time="150">
									<view class="flex  align-center ">
										<view class="flex-sub text-center">
											<i class="iconfont icon-siweiqi  text-white"></i>
											<text class="padding-left-xs text-md text-white">批量升级饲喂器</text>
										</view>
									</view>
								</view>
							</view>
						</view>
						
					</view> -->

				</view>

			</block>
		</scroll-view>

		<view class="cu-modal bottom-modal" :class="showDeviceMenu?'show':''" @tap="hideDeviceModal">
			<view class="cu-dialog">
				<view class="">
					<view class="cu-list menu">
						<view v-if="is_admin" class="cu-item arrow" @tap="onUpdateGw()">
							<view class="content">
								<text class="iconfont icon-yingjian text-grey"></text>
								<text class="text-grey padding-left-xs">升级终端</text>
							</view>
						</view>
						<view v-if="is_admin" class="cu-item arrow" @tap="onUpdateNode()">
							<view class="content">
								<text class="iconfont icon-siweiqi text-grey"></text>
								<text class="text-grey padding-left-xs">升级饲喂器</text>
							</view>
						</view>
						
					</view>


				</view>
			</view>
		</view>

		<view class="cu-modal bottom-modal" :class="showFirmwareMenu?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white">
					<view class="action text-gray" @tap="hideModalFirmware">取消</view>
					<view class="action text-green" @tap="onConfirmUpdate">确定</view>
				</view>

				<view class="padding flex justify-begin">
					<text class="iconfont icon-tishi1 text-green"></text>
					<text class="text-md text-grey text-sm">请选择固件后点击[确定]</text>
				</view>

				<view class="padding">
					<scroll-view scroll-y="true" class="scroll-Y " style="height: 500rpx;">
						<block v-for="(item, idx) in firmwareList" :key="idx">
							<view @tap="onFirmwareSelect(idx)" :class="item.select>0?'bg-select':'bg-unselect'"
								class=" margin-sm " hover-class="opcity" hover-stay-time="150">
								<view class="padding-sm flex align-center">
									<view class="flex-treble text-left">
										<text class=" text-grey padding-left-xs">{{item.name}}</text>
									</view>
									<view class="flex-sub text-right justify-center">
										<text class="text-grey">{{item.food_plan}}</text>
									</view>
								</view>
							</view>
						</block>
					</scroll-view>
				</view>

				<view class="padding">

				</view>

			</view>
		</view>

	</view>
</template>

<script>
	import cmdProgress from "@/components/cmd-progress/cmd-progress.vue"
	import * as api from 'common/api.js';
	const moment = require("../../common/moment.min.js");
	import * as echarts from '@/uni_modules/lime-echart/static/echarts.min'
	import {
		API_HEAD
	} from '../../common/api.js';
	// import arprogress from '@/components/ar-circle-progress/index.vue';

	const maskColor = "rgba(0, 0, 0, 0.2)";
	const redColor = "#FF3366";
	const greenColor = "#009900";
	const blueColor = "#009900";
	const grayColor = "#3e4144";
	const cyanColor = "#6ed0e0";
	const waterColor = "#00CCFF";
	const lightGreenColor = "#429c5e";
	const lightOrangeColor = "#f47011";
	const lightOrangeColor1 = "#eab839";
	const lightOrangeColor2 = "#ffee01";
	const co2Color = "#91c7ae";
	const gasColor = "#61a0a8";
	const titleColor = "#8f97b3";

	var chartDayAvgFeedOptions = {
		// backgroundColor: '#0e1a39',
		legend: {
			show: true,
			x: 'center',
			y: '10',
			icon: 'stack',
			itemWidth: 10,
			itemHeight: 10,
			textStyle: {
				fontSize: 11,
				color: 'rgb(0,253,255,0.6)'
			},
			data: ['下料量(kg)', "下水量(L)"]
		},
		tooltip: {
			trigger: 'axis',
			axisPointer: {
				lineStyle: {
					color: {
						type: 'linear',
						x: 0,
						y: 0,
						x2: 0,
						y2: 1,
						colorStops: [{
							offset: 0,
							color: 'rgba(0, 255, 233,0)'
						}, {
							offset: 0.5,
							color: 'rgba(255, 255, 255,1)',
						}, {
							offset: 1,
							color: 'rgba(0, 255, 233,0)'
						}],
						global: false
					}
				},
			}
		},
		grid: {
			top: '15%',
			left: '5%',
			right: '5%',
			bottom: '15%',
			containLabel: true
		},
		xAxis: [{
			type: 'category',
			axisLine: {
				show: true
			},
			splitArea: {
				// show: true,
				color: '#f00',
				lineStyle: {
					color: '#f00'
				},
			},
			axisLabel: {
				color: titleColor
			},
			splitLine: {
				show: false
			},
			boundaryGap: false,
			//data: ['A', 'B', 'C', 'D', 'E', 'F'],

		}],
		yAxis: [{
			type: 'value',
			min: 0,
			splitLine: {
				show: false,
				lineStyle: {
					color: 'rgba(255,255,255,0.1)'
				}
			},
			axisLine: {
				show: false,
			},
			axisLabel: {
				show: true,
				margin: 20,
				textStyle: {
					color: titleColor,
				},
				formatter: '{value} kg',
			},
			axisTick: {
				show: true,
			},
		}, {
			type: 'value',
			min: 0,
			splitLine: {
				show: true,
				lineStyle: {
					color: 'rgba(255,255,255,0.1)'
				}
			},
			axisLine: {
				show: false,
			},
			axisLabel: {
				show: true,
				margin: 20,
				textStyle: {
					color: titleColor,
				},
				formatter: '{value} L',
			},
			axisTick: {
				show: true,
			},
		}],
		series: [{
			name: '下料量(kg)',
			type: 'line',
			//symbolSize: 3,
			smooth: true, //是否平滑
			showSymbol: true,
			// symbol: 'image://./static/images/guang-circle.png',
			//symbol: 'none',
			yAxisIndex: 0,

			areaStyle: {
				normal: {
					color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
						offset: 0,
						color: lightOrangeColor
					}, {
						offset: 0.8,
						color: 'rgba(255,255,255,0)'
					}], false),
					// shadowColor: 'rgba(255,255,255, 0.1)',
					shadowBlur: 10,
					opacity: 0.3,
				}
			},
			itemStyle: {
				normal: {
					color: lightOrangeColor,
					lineStyle: {
						width: 1,
						type: 'solid' //'dotted'虚线 'solid'实线
					},
					borderColor: lightOrangeColor, //图形的描边颜色。支持的格式同 color
					//borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
					barBorderRadius: 0,
					label: {
						show: false,
					},
					opacity: 0.5,
				}
			},
			tooltip: {
				show: true
			}
		}, {
			name: '下水量(L)',
			type: 'line',
			smooth: true, //是否平滑
			showSymbol: true,
			yAxisIndex: 1,
			areaStyle: {
				normal: {
					color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
						offset: 0,
						color: '#00c7d9'
					}, {
						offset: 0.8,
						color: 'rgba(255,255,255,0)'
					}], false),
					// shadowColor: 'rgba(255,255,255, 0.1)',
					shadowBlur: 10,
					opacity: 0.3,
				}
			},
			itemStyle: {
				normal: {
					color: '#00c7d9',
					lineStyle: {
						width: 1,
						type: 'solid' //'dotted'虚线 'solid'实线
					},
					borderColor: '#00c7d9', //图形的描边颜色。支持的格式同 color
					//borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
					barBorderRadius: 0,
					label: {
						show: false,
					},
					opacity: 0.5,
				}
			},
			tooltip: {
				show: true
			}
		}]
	};
	var chartDaySumFeedOptions = {
		// backgroundColor: '#0e1a39',
		legend: {
			show: true,
			x: 'center',
			y: '10',
			icon: 'stack',
			itemWidth: 10,
			itemHeight: 10,
			textStyle: {
				fontSize: 11,
				color: 'rgb(0,253,255,0.6)'
			},
			//data: ['下料量(kg)', '下水量(L)'],
		},
		tooltip: {
			trigger: 'axis',
			axisPointer: {
				type: 'shadow'
			}
		},
		grid: {
			left: '3%',
			right: '4%',
			bottom: '15%',
			containLabel: true
		},
		xAxis: [{
			type: 'category',
			boundaryGap: true,
			data: [],
			splitLine: {
				show: true,
				lineStyle: {
					color: 'rgba(255,255,255,0.05)'
				}
			},
			axisLabel: {
				textStyle: {
					color: titleColor
				},
				//alignWithLabel: true,
				//interval: 0,
				//rotate: '15'
			}
		}],
		yAxis: [{
				type: 'value',
				splitLine: {
					show: true,
					lineStyle: {
						color: 'rgba(255,255,255,0.05)'
					}
				},
				axisLabel: {
					textStyle: {
						color: titleColor
					},
					formatter: '{value} kg',
				},
			},
			{
				type: 'value',
				splitLine: {
					show: true,
					lineStyle: {
						color: 'rgba(255,255,255,0.05)'
					}
				},
				axisLabel: {
					textStyle: {
						color: titleColor
					},
					formatter: '{value} L',
				},
			}
		],
		series: [{
				name: '下料量(kg)',
				type: 'bar',
				//barWidth: '10px',
				barMaxWidth: '10px',
				yAxisIndex: 0,
				data: [],
				itemStyle: {
					normal: {
						color: lightOrangeColor1,
						barBorderRadius: [30, 30, 30, 30],
						shadowColor: '#f29725',
						shadowBlur: 4,
					}
				},
			},
			{
				name: '下水量(L)',
				type: 'bar',
				//barWidth: '10px',
				barMaxWidth: '10px',
				yAxisIndex: 1,
				data: [],
				itemStyle: {
					normal: {
						color: waterColor,
						barBorderRadius: [30, 30, 30, 30],
						shadowColor: blueColor,
						shadowBlur: 4,
					}
				},
			},
			{
				name: '目标下料量(kg)',
				type: 'line',
				smooth: false, //是否平滑
				showSymbol: true,
				yAxisIndex: 0,
				itemStyle: {
					normal: {
						color: lightOrangeColor1,
						lineStyle: {
							width: 1,
							type: 'dotted' //'dotted'虚线 'solid'实线
						},
						borderColor: lightOrangeColor1, //图形的描边颜色。支持的格式同 color
						//borderWidth: 8 ,//描边线宽。为 0 时无描边。[ default: 0 ]
						barBorderRadius: 0,
						label: {
							show: false,
						},
						opacity: 0.5,
					}
				},
				tooltip: {
					show: true
				}
			}
		]
	};

	export default {
		// components: {cmdProgress},
		data() {
			return {
				//actions:[],
				edit_permission:false,
				delete_permission:false,
				update_permission:false,
				is_admin:0,

				scrollHeight: 0,
				innerScrollHeight: 0,
				houseListScrollHeight: 0,
				deviceListScrollHeight:0,
				offsetDeviceListScrollHeight:0,

				showDeviceMenu:false,
				showFirmwareMenu:false,


				loading: false,

				farmname: '',
				id: '',
				TabCur: 0,
				DaySumFeedType: '',

				pig_num_total: '-',
				num_stop: '-',
				today_feed: '-',
				yestoday_feed: '-',
				today_water: '-',
				yestoday_water: '-',
				
				today_avg_feed: '-',
				yestoday_avg_feed: '-',
				today_avg_water: '-',
				yestoday_avg_water: '-',
				
				today_feed_diff: 0,
				today_water_diff: 0,
				online_num: 0,
				offline_num: 0,
				alarm_device_num: 0,
				alarm_num:0,
				son_total: '-',
				pig_num1: '-',
				pig_num2: '-',
				pig_num3: '-',
				pig_num4: '-',
				pig_num5: '-',
				house_num: '-',
				gw_num: '-',
				gw_alive_num: '-',
				gw_all_online: false,

				online_per: 0,

				province: '',
				city: '',
				address: "",
				person: "",
				phone: "",

				houseList: [],
				house_type: '',

				deviceList: [],

				dayData: [],

				selectDevice:null,
				firmwareList:[],
			}
		},
		onReady() {
			// 计算scroll-view高度
			uni.getSystemInfo({
				success: resu => {
					//console.info("窗口高度:", resu.windowHeight)
					const query = uni.createSelectorQuery()
					query.select('.title').boundingClientRect()
					query.exec(res => {

						//console.info("顶部下拉区域:", res[0])
						this.scrollHeight = resu.windowHeight - res[0].height - 10 + 'px';
						this.innerScrollHeight = resu.windowHeight - res[0].height - 10 - 45 + 'px';
						this.houseListScrollHeight = resu.windowHeight - res[0].height - 10 - 45 - 50 + 'px';
						this.deviceListScrollHeight = resu.windowHeight - res[0].height - 10 - 45 ;
						//console.log('剩余高度', this.scrollHeight);
					})
				}
			})
		},
		onShow: function() {
			console.info("show farm")
			uni.setNavigationBarTitle({
				title: this.farmname
			});
		},
		created() {

		},
		onLoad(option) {
			console.info("load farm", option)
			if (option.farmname) {
				this.farmname = option.farmname
				this.id = option.id
			}
			if (this.id != '') {
				this.loadFarmInfo()
				this.loadDayFeed()
			}

			var that = this
			getApp().getActions("/Device/List").then(function(res){
				if (res.code >= 0) {
					var actions = res.data
					that.edit_permission = false
					that.setparam_permission = false
					that.delete_permission = false
					that.manulfeed_permission =false
					for(var i=0;i<actions.length;i++){
						if(actions[i].action_id=='edit'){
							that.edit_permission = true
						}
						if(actions[i].action_id=='delete'){
							that.delete_permission = true
						}
						if(actions[i].action_id=='update'){
							that.update_permission = true
						}
					}
					//console.info(that.setparam_permission)
				}
			})

			var is_admin = getApp().isAdmin()
			that.is_admin = is_admin
			console.info("is_admin",that.is_admin)
		},
		methods: {
			onTabSelect(idx) {
				console.info(idx)
				this.TabCur = idx
				if (this.id != '') {

				}
				if (this.TabCur == 0) {
					this.loadFarmInfo()
					this.loadDayFeed()
				} else if (this.TabCur == 1) {
					this.loadHouseList()
				} else if (this.TabCur == 2) {
					if(this.is_admin){
						//this.offsetDeviceListScrollHeight = this.deviceListScrollHeight -50  + 'px'
						this.offsetDeviceListScrollHeight = this.deviceListScrollHeight+ 'px'
					}else{
						this.offsetDeviceListScrollHeight = this.deviceListScrollHeight+ 'px'
					}
					this.loadDevice()
				}
			},
			onTabDaySumFeedType(val) {
				this.DaySumFeedType = val
				this.loadDayFeed()
			},
			onTabHouseType(val) {
				this.house_type = val
				this.loadHouseList()
			},
			showDeviceModal() {
				if(!this.is_admin){
					uni.showToast({
						title: '您没有权限',
						icon: 'none'
					})
				}else{
					this.showDeviceMenu = true
				}
			},
			showFirmwareModal(type) {
				this.showFirmwareMenu = true
				this.loadFirmware(type)
			},
			hideDeviceModal(){
				console.info("hideDeviceModal")
				this.showDeviceMenu = false
			},
			hideModalFirmware(){
				console.info("hideDeviceModal")
				this.showFirmwareMenu = false
			},
			onDeviceTap(item){
				console.info(JSON.stringify(item))
				if(this.is_admin){
					this.selectDevice = item
					this.showDeviceModal();
				}
			},
			onFirmwareSelect(idx) {
				console.info("onFirmwareSelect", idx)
				for (var i = 0; i < this.firmwareList.length; i++) {
					this.firmwareList[i].select = 0
				}
				this.firmwareList[idx].select = 1
				this.$forceUpdate()
			},
			onHouseClick(item) {
				console.info(JSON.stringify(item))
				uni.navigateTo({
					url: "/pages/house/house?farmname=" + item.farmname + "&farmid=" + item.farmid +
						"&housename=" + item.housename + "&houseid=" + item.houseid
				})
			},
			onFarmAlarm() {
				uni.navigateTo({
					url: "/pages/alarm/alarm?farmname=" + this.farmname + "&farmid=" + this.id
				})
			},
			onHouseAlarm(item) {
				console.info(JSON.stringify(item))
				uni.navigateTo({
					url: "/pages/alarm/alarm?farmname=" + item.farmname + "&farmid=" + item.farmid +
						"&housename=" + item.housename + "&houseid=" + item.houseid
				})
			},
			loadFarmInfo() {
				var that = this
				var token = getApp().getToken()
				api.myRequest({
					url: '/Api/Farm/SummaryInfo',
					method: 'GET',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authorization': 'Bearer ' + token + ''
					},
					data: {
						id: that.id
					},
				}, false).then(res => {
					if (res.code >= 0) {
						//console.info(res)
						var obj = res.data;
						if (obj.pig_num_total > 0) {
							that.pig_num_total = obj.pig_num_total;
						} else {
							that.pig_num_total = 0;
						}

						if (obj.num_stop > 0) {
							that.num_stop = obj.num_stop;
						} else {
							that.num_stop = 0;
						}

						if (obj.today_feed) {
							that.today_feed = parseFloat(obj.today_feed.toFixed(1));
						} else {
							that.today_feed = 0;
						}
						
						if (obj.yestoday_feed) {
							that.yestoday_feed = parseFloat(obj.yestoday_feed.toFixed(1));
						} else {
							that.yestoday_feed = 0;
						}
						if (obj.today_water) {
							that.today_water = parseFloat(obj.today_water.toFixed(1));
						} else {
							that.today_water = 0;
						}
						if (obj.yestoday_water) {
							that.yestoday_water = parseFloat(obj.yestoday_water.toFixed(1));
						} else {
							that.yestoday_water = 0;
						}

						if (that.today_feed > 0) {
							that.today_feed_diff = parseFloat(((that.today_feed - that.yestoday_feed) / that
								.today_feed * 100).toFixed(1));
						} else {
							that.today_feed_diff = 0;
						}

						if (that.today_water > 0) {
							that.today_water_diff = parseFloat(((that.today_water - that.yestoday_water) / that
								.today_water * 100).toFixed(1));
						} else {
							that.today_water_diff = 0;
						}
						
						if(that.pig_num_total>0)
						{
							that.today_avg_feed = parseFloat((that.today_feed/that.pig_num_total).toFixed(1))
							that.today_avg_water = parseFloat((that.today_water/that.pig_num_total).toFixed(1))
							that.yestoday_avg_feed = parseFloat((that.yestoday_feed/that.pig_num_total).toFixed(1))
							that.yestoday_avg_water = parseFloat((that.yestoday_water/that.pig_num_total).toFixed(1))
						}else{
							that.today_avg_feed = 0
							that.today_avg_water = 0
							that.yestoday_avg_feed = 0
							that.yestoday_avg_water =0
						}

						//that.today_water_diff = parseFloat(((that.today_water - that.yestoday_water) / that.today_water * 100).toFixed(1));

						if (obj.online_num > 0) {
							that.online_num = obj.online_num;
						} else {
							that.online_num = 0;
						}
						if (obj.offline_num > 0) {
							that.offline_num = obj.offline_num;
						} else {
							that.offline_num = 0;
						}
						if (that.online_num + that.offline_num > 0) {
							that.online_per = parseFloat(((that.online_num / (that.online_num + that
									.offline_num)) *
								100).toFixed(1));
						} else {
							that.online_per = 0;
						}

						if (obj.alarm_device_num > 0) {
							that.alarm_device_num = obj.alarm_device_num;
						} else {
							that.alarm_device_num = "0";
						}
						
						if (obj.alarm_num > 0) {
							that.alarm_num = obj.alarm_num;
						} else {
							that.alarm_num = "0";
						}
						that.son_total = obj.son_total;
						that.pig_num1 = obj.pig_num1;
						that.pig_num2 = obj.pig_num2;
						that.pig_num3 = obj.pig_num3;
						that.pig_num4 = obj.pig_num4;
						that.pig_num5 = obj.pig_num5;
						that.pig_num6 = obj.pig_num6;
						that.house_num = obj.house_num;
						that.gw_num = obj.gw_num;
						that.gw_alive_num = obj.gw_alive_num;
						if (obj.gw_num == obj.gw_alive_num) {
							that.gw_all_online = 1;
						} else {
							that.gw_all_online = 0;
						}

						that.loadDayAvgFeed()
					} else {

					}
				}).catch(err => {
					console.log(err)
				})
			},
			loadDayFeed() {

				var that = this
				var token = getApp().getToken()

				var begin = moment().add(-1, 'months').format('YYYY-MM-DD');
				var end = moment().add(-1, 'days').format('YYYY-MM-DD');

				that.loading = true
				api.myRequest({
					url: '/Api/Farm/DaySumFeed',
					method: 'GET',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authorization': 'Bearer ' + token + ''
					},
					data: {
						id: that.id,
						begin: begin,
						end: end
					},
				}, false).then(res => {
					that.loading = false
					if (res.code >= 0) {

						that.dayData = res.data
						that.showChart1()
						that.showChart2()
					} else {

					}
				}).catch(err => {
					that.loading = false
					console.log(err)
				})
			},
			showChart1() {
				var that = this
				that.$refs.chart.init(echarts, chart => {
					var day_arr = [];
					var val_arr = [];
					var val1_arr = [];
					var max_arr = [];

					if (that.DaySumFeedType == "") {
						for (var i = 0; i < that.dayData.length; i++) {
							var his = that.dayData[i];
							var feed = parseFloat(his.day_use_feed_auto) + parseFloat(his.day_use_feed_man);
							var water = parseFloat(his.day_use_water_auto) + parseFloat(his.day_use_water_man);
							val_arr.push(feed.toFixed(2));
							val1_arr.push(water.toFixed(2));
							max_arr.push(parseFloat(his.max_feed.toFixed(2)));
							day_arr.push(moment(his.his_date).format("MM/DD"));
						}
						chartDaySumFeedOptions.series[0].data = val_arr;
						chartDaySumFeedOptions.series[1].data = val1_arr;
						chartDaySumFeedOptions.xAxis[0].data = day_arr;
						chartDaySumFeedOptions.series[0].name = "总下料量(kg)";
						chartDaySumFeedOptions.series[1].name = "总下水量(L)";
					} else if (that.DaySumFeedType == "auto") {
						for (var i = 0; i < that.dayData.length; i++) {
							var his = that.dayData[i];
							var feed = parseFloat(his.day_use_feed_auto);
							var water = parseFloat(his.day_use_water_auto);
							val_arr.push(feed.toFixed(2));
							val1_arr.push(water.toFixed(2));
							max_arr.push(parseFloat(his.max_feed.toFixed(2)));
							day_arr.push(moment(his.his_date).format("MM/DD"));
						}
						chartDaySumFeedOptions.series[0].data = val_arr;
						chartDaySumFeedOptions.series[1].data = val1_arr;
						chartDaySumFeedOptions.xAxis[0].data = day_arr;
						chartDaySumFeedOptions.series[0].name = "智能下料量(kg)";
						chartDaySumFeedOptions.series[1].name = "智能总下水量(L)";
					} else if (that.DaySumFeedType == "man") {
						for (var i = 0; i < that.dayData.length; i++) {
							var his = that.dayData[i];
							var feed = parseFloat(his.day_use_feed_man);
							var water = parseFloat(his.day_use_water_man);
							val_arr.push(feed.toFixed(2));
							val1_arr.push(water.toFixed(2));
							max_arr.push(parseFloat(his.max_feed.toFixed(2)));
							day_arr.push(moment(his.his_date).format("MM/DD"));
						}
						chartDaySumFeedOptions.series[0].data = val_arr;
						chartDaySumFeedOptions.series[1].data = val1_arr;
						chartDaySumFeedOptions.xAxis[0].data = day_arr;
						chartDaySumFeedOptions.series[0].name = "手动下料量(kg)";
						chartDaySumFeedOptions.series[1].name = "手动总下水量(L)";
					}


					chartDaySumFeedOptions.series[2].data = max_arr;
					setTimeout(function() {
						chart.setOption(chartDaySumFeedOptions);
						chart.resize()
					}, 200);
				})
			},
			showChart2() {
				var that = this
				that.$refs.chart1.init(echarts, chart1 => {
					var day_arr = [];
					var val_arr = [];
					var val1_arr = [];

					//console.info(res.data)
					for (var i = 0; i < this.dayData.length; i++) {
						var his = this.dayData[i];
						var feed = parseFloat(his.day_use_feed_auto) + parseFloat(his.day_use_feed_man);
						var water = parseFloat(his.day_use_water_auto) + parseFloat(his.day_use_water_man);
						
						var avg_feed = feed / his.pig_num
						var avg_water = water / his.pig_num
						
						val_arr.push(avg_feed.toFixed(2));
						val1_arr.push(avg_water.toFixed(2));
						day_arr.push(moment(his.his_date).format("MM/DD"));
					}


					chartDayAvgFeedOptions.series[0].data = val_arr;
					chartDayAvgFeedOptions.series[1].data = val1_arr;
					chartDayAvgFeedOptions.xAxis[0].data = day_arr;

					setTimeout(function() {
						chart1.setOption(chartDayAvgFeedOptions);
						chart1.resize();
					}, 200);
				})
			},
			loadDevice() {
				var that = this
				var token = getApp().getToken()
				that.loading = true
				api.myRequest({
					url: '/Api/Device',
					method: 'GET',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authorization': 'Bearer ' + token + ''
					},
					data: {
						farmid: that.id
					},
				}, false).then(res => {
					that.loading = false
					if (res.code >= 0) {

						var list = res.data
						for(var i=0;i<list.length;i++){
							if(list[i].node_version){
								var arr = list[i].node_version.split(",")
								if(arr.length>1){
									//多个版本
									list[i].node_version = '多种';
								}else{

								}
							}


						}

						that.deviceList = list

						for(var i=0;i<list.length;i++){
							that.checkUpdateStatus(list[i])
						}

					} else {

					}
				}).catch(err => {
					that.loading = false
					console.log(err)
				})
			},
			loadHouseList() {
				var that = this
				var token = getApp().getToken()
				that.loading = true
				api.myRequest({
					url: '/Api/House/SummaryInfo',
					method: 'GET',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authorization': 'Bearer ' + token + ''
					},
					data: {
						farmid: that.id,
						house_type: that.house_type
					},
				}, false).then(res => {
					that.loading = false
					if (res.code >= 0) {
						//console.table(res.data)
						var houses = res.data;
						if (houses) {
							for (var i = 0; i < houses.length; i++) {
								if (houses[i].today_feed) {
									houses[i].today_feed = parseFloat(houses[i].today_feed.toFixed(1));
								} else {
									houses[i].today_feed = 0;
								}

								if (houses[i].today_water) {
									houses[i].today_water = parseFloat(houses[i].today_water.toFixed(1));
								} else {
									houses[i].today_water = 0;
								}

								if (houses[i].yestoday_feed) {
									houses[i].yestoday_feed = parseFloat(houses[i].yestoday_feed.toFixed(1));
								} else {
									houses[i].yestoday_feed = 0;
								}
								if (houses[i].max_feed) {
									houses[i].max_feed = parseFloat(houses[i].max_feed.toFixed(1));
								} else {
									houses[i].max_feed = 0;
								}


								if (houses[i].max_feed > 0) {
									houses[i].feed_per = parseFloat(((houses[i].today_feed / houses[i].max_feed) *
										100).toFixed(1));
								} else {
									houses[i].feed_per = 0;
								}

								houses[i].feed_per_str = houses[i].feed_per + "%";
								houses[i].feed_per_bar_color = "";
								houses[i].feed_per_color = "";
								if (houses[i].feed_per < 60) {
									houses[i].feed_per_bar_color = "layui-bg-red";
									houses[i].feed_per_color = "layui-text-red";
								} else if (houses[i].feed_per >= 60 && houses[i].feed_per < 98) {
									houses[i].feed_per_bar_color = "layui-bg-orange";
									houses[i].feed_per_color = "layui-text-orange";
								} else if (houses[i].feed_per >= 98) {
									houses[i].feed_per_bar_color = "layui-bg-green-light";
									houses[i].feed_per_color = "layui-text-green-light";
								}

								houses[i].online_num = houses[i].online_num | 0;
								houses[i].offline_num = houses[i].offline_num | 0;
								houses[i].device_num = houses[i].online_num + houses[i].offline_num;

								if (houses[i].device_num > 0) {
									houses[i].online_per = parseFloat(((houses[i].online_num / houses[i]
										.device_num) * 100).toFixed(1));
								} else {
									houses[i].online_per = 0;
								}
								houses[i].online_per_str = houses[i].online_per + "%";
								houses[i].online_per_bar_color = "";
								houses[i].online_per_color = "";
								if (houses[i].online_per < 60) {
									houses[i].online_per_bar_color = "layui-bg-red";
									houses[i].online_per_color = "layui-text-red";
								} else if (houses[i].online_per >= 60 && houses[i].online_per < 100) {
									houses[i].online_per_bar_color = "layui-bg-orange";
									houses[i].online_per_color = "layui-text-orange";
								} else if (houses[i].online_per >= 100) {
									houses[i].online_per_bar_color = "layui-bg-green-light";
									houses[i].online_per_color = "layui-text-green-light";
								}

								houses[i].pig_num_total = houses[i].pig_num_total | 0;
								houses[i].pig_num = houses[i].pig_num | 0;
								houses[i].son_total = houses[i].son_total | 0;
								houses[i].alarm_device_num = houses[i].alarm_device_num | 0;
								houses[i].alarm_num = houses[i].alarm_num | 0;

								if(houses[i].pig_num_total>0){
									houses[i].avg_feed = parseFloat((houses[i].today_feed/houses[i].pig_num_total).toFixed(2).toString())
									houses[i].today_avg_feed =houses[i].avg_feed
									houses[i].today_avg_water = parseFloat((houses[i].today_water/houses[i].pig_num_total).toFixed(2).toString())
									houses[i].yestoday_avg_feed = parseFloat((houses[i].yestoday_feed/houses[i].pig_num_total).toFixed(2).toString())
								}else{
									houses[i].avg_feed = 0
									 houses[i].today_avg_feed =0
									 houses[i].today_avg_water =0
									 houses[i].yestoday_avg_feed =0
								}
								
							}
						}
						that.houseList = houses
					} else {

					}
				}).catch(err => {
					that.loading = false
					console.log(err)
				})
			},
			loadFirmware(type){

				var that = this
				var token = getApp().getToken()
				that.loading = true
				api.myRequest({
					url: '/Api/Firmware',
					method: 'GET',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authorization': 'Bearer ' + token + ''
					},
					data: {},
				}, false).then(res => {
					that.loading = false
					if (res.code >= 0) {

						var firmwares =res.data
						var matchs=[];
						for(var i=0;i<firmwares.length;i++){
							if(firmwares[i].type==type){
								matchs.push(firmwares[i])
							}
						}

						that.firmwareList = matchs

					} else {

					}
				}).catch(err => {
					that.loading = false
					console.log(err)
				})
			},
			onUpdateGw(){
				this.hideDeviceModal()
				this.showFirmwareModal('Gw')
			},
			onUpdateNode(){
				this.hideDeviceModal()
				this.showFirmwareModal('Gw_NODE')
			},
			onConfirmUpdate(){
				//
				var that = this
				var idx = -1
				for (var i = 0; i < that.firmwareList.length; i++) {
					if (that.firmwareList[i].select == 1) {
						idx = i
						break
					}
				}
				if (idx < 0) {
					//that.hideModalPlan()
					console.info("idx:未选择", idx)
					uni.showToast({
						title: '请先选择固件',
						icon: 'error'
					})
				}else{
					var firmware = that.firmwareList[idx]
					
					that.hideModalFirmware()
					that.doUpdate(firmware)
				}
			},
			doUpdate(firmware){
				var that = this
				var url = ''
				if(firmware.type=="Gw"){
					url='/Api/Device/Gw/Update'
				}else if(firmware.type=="Gw_NODE"){
					url='/Api/Device/Gw/UpdateNode'
				}
				console.info("firmware:",JSON.stringify(firmware))
				console.info("device:",JSON.stringify(that.selectDevice))
				uni.showModal({
					title: '提示',
					content: '请注意,您即将对' + that.selectDevice.remark + '升级固件:' + firmware.name +' ,您的操作将会被系统记录',
					success: function(res) {
						if (res.confirm) {
							console.log('用户点击确定');
							var token = getApp().getToken()
							that.loading = true
							api.myRequest({
								url: url,
								method: 'PUT',
								header: {
									'content-type': 'application/x-www-form-urlencoded',
									'Authorization': 'Bearer ' + token + ''
								},
								data: {
									addr: that.selectDevice.device_addr,
									type: firmware.type,
									device_type: firmware.type,
									id:firmware.id,
									filename: firmware.name,
								},
							}, false).then(res => {
								that.loading = false
								if (res.code >= 0) {
									uni.showToast({
										title: '操作成功',
										icon: 'success',
										duration: 2000
									});
									setTimeout(function() {
										that.loadDevice()
									}, 5 * 1000)
								} else {
									uni.showModal({
										title: '失败',
										content: res.msg,
										showCancel: false
									})
								}
							}).catch(err => {
								that.loading = false
								console.log(err)
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			checkUpdateStatus(item){
				var that = this
				var token = getApp().getToken()
				api.myRequest({
					url: '/Api/Device/Gw/UpdateStatus',
					method: 'GET',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authorization': 'Bearer ' + token + ''
					},
					data: {
						addr: item.device_addr
					},
				}, false).then(res => {
					if (res.code >= 0) {
						var update = false
						var str = ""
						if(res.data){
							if(res.data.Ug_State){
								update = true
								
								str+=(" 数据包:"+res.data.Ug_pkg+"/"+res.data.Ug_Tpkg);
								str+=(" 饲喂器序号:"+res.data.Ug_tn);
							}
						}
						for(var i=0;i<that.deviceList.length;i++){
							if(that.deviceList[i].device_addr == item.device_addr){
								that.deviceList[i].upStatus = str
								that.deviceList[i].update = update
								this.$forceUpdate()
								break
							}
						}
					} else {

					}
				}).catch(err => {
					
					console.log(err)
				})
			},
		}

	}
</script>

<style>
	.bg-pannel {
		min-height: 180rpx;
		border-radius: 5rpx;
		/* opacity: 0.9; */
		/* background: url("https://www.hozenn.com/iot/img/house.png") 80% 50% / 40% no-repeat linear-gradient(to top, rgba(255, 255, 255, 0.95)); */
		/* background-image:linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)),url('https://www.hozenn.com/iot/img/house.png'); */
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: 55% 50%;
		background-color: rgba(230, 230, 230, 0.3);
		box-shadow: 0 2px 4px rgba(100, 100, 155, 0.5);
	}

	.bg-alarm {
		background-color: rgba(255, 96, 48, 0.3);
		/* border: 1px solid #e54d42; */
	}

	.device-pannel {
		min-height: 180rpx;
		border-radius: 5rpx;
		/* opacity: 0.9; */
		/* background: url("https://www.hozenn.com/iot/img/house.png") 80% 50% / 40% no-repeat linear-gradient(to top, rgba(255, 255, 255, 0.95)); */
		/* background-image:linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)),url('https://www.hozenn.com/iot/img/house.png'); */
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: 55% 50%;
		background-color: rgba(230, 230, 230, 0.6);
		box-shadow: 0 2px 4px rgba(100, 100, 155, 0.5);
	}

	.bg-online {
		background-color: rgba(230, 230, 230, 0.6);
		/* border: 1px solid #0d8400; */
	}

	.bg-offline {
		background-color: rgba(230, 230, 230, 0.6);
		/* border: 1px solid #878787; */
	}

	.house_panel {
		min-height: 200rpx;
		border-radius: 10rpx;
		/* background-color: #192654; */
		/* border: 1px solid #0081ff; */
		background-color: rgba(230, 230, 230, 0.3);
		box-shadow: 0 2px 4px 0 rgba(100, 100, 155, 0.6);
	}

	.opcity {
		opacity: 0.6;
	}

	.cu-modal{
		z-index: 2;
	}

	.split {
		border-right: 1px solid #f5f3f379;
	}

	.bottom-grey-line {
		margin: 1px 0px;
		border-bottom: 1px solid #485473;
	}


	.bottom-blue-line {
		margin: 1px 0px;
		border-bottom: 1px solid #0081ff;
	}

	.bottom-green-line {
		margin: 1px 0px;
		border-bottom: 1px solid #39b54a;
	}

	.bottom-orange-line {
		margin: 1px 0px;
		border-bottom: 1px solid #f37b1d;
	}

	.bottom-red-line {
		margin: 1px 0px;
		border-bottom: 1px solid #e54d42;
	}


	.bottom-bar {
		height: 50px;
		border-top: 1px solid #aaa;
		/* background-color: aliceblue; */
		/* border-top:1px solid #878787; */
	}

	.tab-batch {
		/* min-height: 180rpx; */
		background-color: rgba(100, 100, 100, 0.5);
		height: 40px;
		border-radius: 20px 00% 0% 20px;
		/* border: 1px solid #e54d42; */
	}

	.tab-reload {
		/* min-height: 180rpx; */
		background-color: rgba(100, 100, 100, 0.5);
		height: 40px;
		border-radius: 0px 20px 20px 0px;
		/* border: 1px solid #e54d42; */
	}

	.tab-reload1 {
		/* min-height: 180rpx; */
		background-color: rgba(100, 100, 100, 0.5);
		height: 40px;
		border-radius: 0px 20px 20px 0px;
		/* border: 1px solid #e54d42; */
	}
	.bg-select {
		background-color: rgba(200, 200, 200, 0.3);
		border: 2px solid #0d8400;
		border-radius: 5px;
	}

	.bg-unselect {
		background-color: rgba(200, 200, 200, 0.3);
		border: 1px solid #dadada;
		border-radius: 5px;
	}
</style>